/* 合同中心》合同关联》关联详情 */
<template>
  <div>
    <div id="samplesFixed" :class="{'samples-fixed' : isFixed}">
      <el-row class="samples-info-box insert-page">
        <el-col :span="15">
          <h2>关联详情</h2>
        </el-col>
        <!-- 右半边按钮区域 -->
        <el-col :span="9" class="samples-text-right">
          <!-- <el-button size="mini" type="primary" plain @click="CloseBtn">取 消</el-button> -->
          <router-link :to="{ name: '/contractManage/contractCorrelation/edit', params: { type: 'edit', id: $route.params.id }}"><el-button size="mini" type="primary" plain>编 辑</el-button>
          </router-link></el-col>
      </el-row>
    </div>
    <contract-list contract-type="收入合同" :edit-data="income" @pushData="IncomeData" />
    <contract-list contract-type="支出合同" :edit-data="expend" @pushData="expendData" />
    <div v-if="income.length>0" class="artical-footer">
      <div v-show="income[0].createUserName" class="footer-pie">
        <div>创建人：</div>
        <div>{{ income[0].createUserName}}</div>
      </div>
      <div v-show="income[0].createTime" class="footer-pie">
        <div>创建时间：</div>
        <div>{{ income[0].createTime}}</div>
      </div>
      <div v-show="income[0].updateUserName" class="footer-pie">
        <div>修改人：</div>
        <div>{{ income[0].updateUserName}}</div>
      </div>
      <div v-show="income[0].updateTime" class="footer-pie">
        <div>修改时间：</div>
        <div>{{ income[0].updateTime}}</div>
      </div>
    </div>
  </div>
</template>

<script>
import { cacheMixin } from '@/utils/mixins/clearCache'
import { fixedMixin } from '@/utils/mixins/fixedHeaderMixin'
import contractList from './components/contractList'
import * as contractCorrelationApi from '@/api/contractManage/contractCorrelation'
export default {
  components: {
    contractList
  },
  mixins: [cacheMixin, fixedMixin],
  data() {
    return {
      income: [],
      expend: [],
      contractId: [],
      beContractId: [],
      confirmData: {},
      isFixed: false
    }
  },
  created() {
    if (this.$route.query.isTag != false) {
      this.getEditData()
    }
  },
  activated() {
    if (this.$route.query.isTag != true) {
      this.getEditData()
    }
  },
  methods: {
    // 点击取消按钮  跳转到列表页面
    // CloseBtn() {
    //   this.clearCache('contractCorrelation/insert')
    //   this.closeTag('/contractManage/contractCorrelation')
    // },
    // 点击确定按钮按钮  提交选中的合同
    // confirmBtn(val) {
    //   if (!this.income.length || !this.expend.length) {
    //     this.$notify({
    //       title: '警告',
    //       message: '请正确选择收入和支出合同',
    //       type: 'warning',
    //       duration: '3000'
    //     })
    //     return false
    //   }
    //   console.log('我点击了确定按钮')
    //   const obj = {
    //     'income': this.income,
    //     'expend': this.expend,
    //     'type': val
    //   }
    //   contractCorrelationApi.contractRelationEdit(obj).then(res => {
    //     console.log('编辑关联成功', res.data)
    //     if (res.code == 1) {
    //     //   alert(123)
    //       this.$notify({
    //         title: '成功',
    //         message: '编辑成功',
    //         type: 'success',
    //         duration: '3000'
    //       })
    //       this.CloseBtn()
    //     } else {
    //       this.$notify.error({
    //         title: '错误',
    //         message: res.msg,
    //         duration: '3000'
    //       })
    //     }
    //   })
    // },
    getEditData() {
      contractCorrelationApi.contractRelationDetail(this.$route.params.id).then(res => {
        this.income = []
        this.expend = []
        this.contractId = res.data.incomeList[0].id
        for (let i = 0; i < res.data.expenditureList.length; i++) {
          this.beContractId[i] = res.data.expenditureList[i].id
        }
        console.log(res.data)
        const resData = res.data
        // for (let i = 0; i < resData.length; i++) {
        //   if (resData[i].typed) {
        this.income = this.income.concat(resData.incomeList)
        // } else {
        this.expend = this.expend.concat(resData.expenditureList)
        // }
        // }
        console.log('expendexpendexpendexpend', this.income, this.expend)
      })
    },
    // 获取要关联的合同
    IncomeData(val) {
      console.log('收入合同传上来的值', val)
      this.income = val
    },
    expendData(val) {
      console.log('支出合同传上来的值', val)
      this.expend = val
    }
  }
}
</script>

<style lang="scss" scoped>
.artical-footer{
    display: flex;
    justify-content: flex-end;
    color: #606266;
    font-size: 14px;
    .footer-pie{
            margin-left: 25px;
            display: flex;
        div:first-child{
            width:56px;
            flex: none;
        }
    }
    .footer-pie:nth-child(even){
        div:first-child{
           width:70px;
        }
    }
}
</style>
